<template>
  <div class="mengdianxingxi">
    <el-dialog :visible.sync="showMap" title="搜索后选择地址">
      <div class="map-wrap">
        <el-amap-search-box class="map-search" :on-search-result="onSearchResult" :searchOption="{}" />
        <el-amap class="map" :center="mapCenter" :zoom="16">
          <el-amap-marker v-for="(marker, index) in markers" :key="index" :position="marker" :events="getMarkerEvents()" />
        </el-amap>
      </div>
    </el-dialog>
    <div class="mod-demo-ueditor" v-loading="dataListLoading" element-loading-text="拼命加载中">
      <el-form :model="dataForm" :disabled="dataForm.trialInfoState == 1" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="auto">
<!--        <el-form-item label="酒店门头照" prop="ewmLogo">
          <el-upload class="avatar-uploader" :action="uploadAction" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
            <img v-if="dataForm.ewmLogo" :src="dataForm.ewmLogo" class="avatar" />
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item> -->

        <el-form-item label-width="0" v-if="dataForm.trialInfoState == 1">
          <el-alert
            title="待审核"
            type="warning"
            show-icon>
          </el-alert>
        </el-form-item>
        <el-form-item label-width="0" v-if="dataForm.trialInfoState == 3">
          <el-alert
            show-icon
            title="审核失败"
            type="warning"
            :description="dataForm.trialMsg">
          </el-alert>
        </el-form-item>
        <el-form-item label="酒店名字" prop="name"><el-input v-model="dataForm.name" placeholder="酒店名字"></el-input></el-form-item>
        <el-form-item label="星级" prop="star">
          <el-select v-model="dataForm.star" placeholder="活动区域">
            <el-option label="一星及以下/经济" value="1"></el-option>
            <el-option label="二星/实惠" value="2"></el-option>
            <el-option label="三星/舒适" value="3"></el-option>
            <el-option label="四星/高档" value="4"></el-option>
            <el-option label="五星/豪华" value="5"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="酒店地址" prop="address"><el-input v-model="dataForm.address" placeholder="酒店地址"></el-input></el-form-item>
        <el-row type="flex" class="row-bg">
          <el-col :span="6">
            <el-form-item label="经纬度" prop="coordinates"><el-input v-model="dataForm.coordinates" placeholder="经纬度"></el-input></el-form-item>
          </el-col>
          <el-col :span="2"  offset="1"><el-button @click="getCoordinates" type="primary">快速获取</el-button></el-col>
          <el-col :span="2" :lg="1" offset="1"><el-button @click="showMap = true" type="primary">地图选点</el-button></el-col>
        </el-row>
        <el-form-item label="联系人" prop="linkName"><el-input v-model="dataForm.linkName" placeholder="联系人"></el-input></el-form-item>
        <el-form-item label="联系电话" prop="linkTel"><el-input v-model="dataForm.linkTel" placeholder="联系电话"></el-input></el-form-item>
        <el-form-item label="酒店电话" prop="tel"><el-input v-model="dataForm.tel" placeholder="酒店电话"></el-input></el-form-item>
        <el-row>
          <el-col :span="6">
            <el-form-item label="开业时间" prop="openTime">
              <el-date-picker style="width:100%" v-model="dataForm.openTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="装修时间" prop="renovationTime">
              <el-date-picker style="width:100%" v-model="dataForm.renovationTime" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="集团品牌" prop="brand"><el-cascader :options="brandOptions" :props="props" v-model="dataForm.brand"></el-cascader></el-form-item>
          </el-col>
        </el-row>
<!--        <el-form-item label="图片" prop="img">
          <el-upload
            :file-list="fileList"
            list-type="picture-card"
            :action="uploadAction"
            :on-preview="handlePictureCardPreview"
            :on-success="handleImageSuccess"
            :on-remove="handleImageRemove"
            :before-upload="beforeAvatarUpload"
            multiple
            :limit="99"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item> -->
        <el-form-item label="退订规则" prop="rule"><el-input v-model="dataForm.rule" placeholder="退订规则"></el-input></el-form-item>

        <!-- <el-form-item label="温馨提示" prop="prompt">
        <el-input v-model="dataForm.prompt" placeholder="温馨提示"></el-input>
      </el-form-item>-->
        <el-form-item label="酒店标签" prop="discounts">
          <el-tag :key="tag" v-for="tag in dataForm.tagList" closable :disable-transitions="false" @close="handleClose(tag)">{{ tag }}</el-tag>
          <el-input class="input-new-tag" v-if="inputVisible" v-model="inputValue" ref="saveTagInput" size="small">
            <el-button slot="append" icon="el-icon-plus" @click="handleInputConfirm()"></el-button>
          </el-input>
          <el-button v-else class="button-new-tag" size="small" @click="showInput">添加</el-button>
        </el-form-item>
        <el-form-item label="酒店设施" class="hotelseller-addorupdate-jdss">
          <el-checkbox-group v-model="dataForm.facility">
            <el-checkbox v-for="(fac, index) in facility" :key="index" :label="fac.name">{{ fac.name }}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="酒店主题">
          <el-select v-model="dataForm.topic" placeholder="酒店主题">
            <el-option v-for="(topic, index) in topics" :key="index" :label="topic.name" :value="topic.name"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="酒店支持">
          <el-checkbox v-model="dataForm.unionpay" :label="1">银联支付</el-checkbox>
          <el-checkbox v-model="dataForm.wxOpen" :label="1">微信支付</el-checkbox>
          <el-checkbox v-model="dataForm.ddOpen" :label="1">到店支付</el-checkbox>
          <el-checkbox v-model="dataForm.yeOpen" :label="1">余额支付</el-checkbox>
        </el-form-item>
        <el-form-item style="height:240px" label="酒店政策" prop="policy">
          <!-- <el-input v-model="dataForm.policy" placeholder="酒店政策"></el-input> -->
          <quill-editor
            style="height:200px"
            class="editor"
            v-model="dataForm.policy"
            ref="myQuillEditor"
            :options="editorOption"
            @blur="onEditorBlur($event)"
            @focus="onEditorFocus($event)"
            @change="onEditorChange($event)"
          ></quill-editor>
        </el-form-item>
        <el-form-item><el-button @click="zc()" type="primary">自动输入</el-button></el-form-item>
        <el-form-item label="酒店介绍" style="height:240px" prop="introduction">
          <!-- <el-input v-model="dataForm.introduction" placeholder="酒店介绍"></el-input> -->
          <quill-editor
            style="height:200px"
            class="editor"
            v-model="dataForm.introduction"
            ref="myQuillEditor"
            :options="editorOption"
            @blur="onEditorBlur($event)"
            @focus="onEditorFocus($event)"
            @change="onEditorChange($event)"
          ></quill-editor>
        </el-form-item>
        <el-form-item><el-button @click="js()" type="primary">自动输入</el-button></el-form-item>
        <el-form-item label="预定提醒" style="height:240px" prop="reserveRemind">
          <!-- <el-input v-model="dataForm.introduction" placeholder="酒店介绍"></el-input> -->
          <quill-editor
            style="height:200px"
            class="editor"
            v-model="dataForm.reserveRemind"
            ref="myQuillEditor"
            :options="editorOption"
            @blur="onEditorBlur($event)"
            @focus="onEditorFocus($event)"
            @change="onEditorChange($event)"
          ></quill-editor>
        </el-form-item>
        <el-form-item><el-button @click="tx()" type="primary">自动输入</el-button></el-form-item>
        <el-form-item label="交通和周边" style="height:240px" prop="traffic">
          <!-- <el-input v-model="dataForm.introduction" placeholder="酒店介绍"></el-input> -->
          <quill-editor
            style="height:200px"
            class="editor"
            v-model="dataForm.traffic"
            ref="myQuillEditor"
            :options="editorOption"
            @blur="onEditorBlur($event)"
            @focus="onEditorFocus($event)"
            @change="onEditorChange($event)"
          ></quill-editor>
        </el-form-item>
        <el-form-item><el-button @click="jtzb()" type="primary">自动输入</el-button></el-form-item>
        
        <el-form-item>
          <el-button v-if="dataForm.trialInfoState == 1" disabled>待审核</el-button>
          <el-button v-if="dataForm.trialInfoState == 2" type="primary" @click="dataFormSubmit()">{{ $t('Common.Confirm') }}</el-button>
          <el-button v-if="dataForm.trialInfoState == 3" type="primary" @click="dataFormSubmit()">重新提交</el-button>
          
        </el-form-item>

      </el-form>
    </div>
    <gallery :images="[showImage]" :index="index" @close="index = null" />
  </div>
</template>

<script>
import VueGallery from 'vue-gallery';
import axios from 'axios';
export default {
  components: {
    gallery: VueGallery
  },
  data() {
    return {
      index: null,
      showImage: [],
      visible: false,
      markers: [],
      mapCenter: [114.05558, 22.539679],
      showMap: false,
      inputVisible: false,
      inputValue: '',
      dataListLoading: false,
      content: '111',
      editorOption: {},
      uploadAction: '',
      dialogVisible: false,
      topics: [],
      facility: [],
      fileList: [],
      brandOptions: [{}],
      props: {
        label: 'name',
        value: 'id',
        children: 'brands'
      },
      dataForm: {
        id:0,
        name:'',
        star:'',
        address:'',
        coordinates:'',
        linkName:'',
        linkTel:'',
        tel:'',
        openTime:'',
        renovationTime:'',
        rule:'',
        topic:'',

        introduction:'',
        policy:'',
        reserveRemind:'',
        traffic:'',

        facility: [],
        brand: [0, 0],
        tagList: [],
        metro: '',
        repast:'',
        wake: '',
        wifi: '',
        park: '',
        breakfast: '',
        unionpay: '',
        gym: '',
        boardroom: '',
        water: '',
        yeOpen: '',
        wxOpen: '',
        ddOpen: ''
      },
      dataRule: {
        name: [{ required: true, message: '名字不能为空', trigger: 'blur' }],
        star: [{ required: true, message: '星级不能为空', trigger: 'blur' }],
        address: [{ required: true, message: '地址不能为空', trigger: 'blur' }],
        // linkName: [
        //   { required: true, message: "联系人不能为空", trigger: "blur" }
        // ],
        // linkTel: [
        //   { required: true, message: "联系电话不能为空", trigger: "blur" }
        // ],
        tel: [{ required: true, message: '酒店电话不能为空', trigger: 'blur' }],
        handle: [{ required: true, message: '办理时间不能为空', trigger: 'blur' }],
        openTime: [{ required: true, message: '开业时间不能为空', trigger: 'blur' }],
        renovationTime: [{ required: true, message: '装修时间不能为空', trigger: 'blur' }],
        wake: [{ required: true, message: '唤醒不能为空', trigger: 'blur' }],
        wifi: [{ required: true, message: 'Wi-Fi不能为空', trigger: 'blur' }],
        park: [{ required: true, message: '停车场不能为空', trigger: 'blur' }],
        time: [{ required: true, message: '时间不能为空', trigger: 'blur' }],
        coordinates: [{ required: true, message: '经纬度不能为空', trigger: 'blur' }],
        scort: [{ required: true, message: '排序不能为空', trigger: 'blur' }]
      }
    };
  },
  activated() {
    this.uploadAction = this.$http.adornUrl(`/sys/oss/upload?token=${this.$cookie.get('token')}`);
    this.init();
  },
  methods: {
    //自动预定提醒
    tx() {
      if (this.dataForm.reserveRemind) {
        this.$confirm('您已有预定提醒内容，是否覆盖?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.sellerTempl('reserveRemind');
        })
        return false
      }
      this.sellerTempl('reserveRemind');
    },
    //自动酒店介绍
    js() {
      if (this.dataForm.introduction) {
        this.$confirm('您已有酒店介绍内容，是否覆盖?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.sellerTempl('introduction');
        })
        return false
      }
      this.sellerTempl('introduction');
    },
    //自动获取政策
    zc() {
      if (this.dataForm.policy) {
        this.$confirm('您已有酒店政策内容，是否覆盖?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.sellerTempl('policy');
        })
        return false
      }
      this.sellerTempl('policy');
    },
    sellerTempl(type) {
      this.$http({
        url: this.$http.adornUrl(`/hotel/common/sellerTempl`),
        method: 'get',
        params: this.$http.adornParams({})
      }).then(({ data }) => {
        if (data && data.code === 0) {
          if (type == 'policy') {
            this.dataForm.policy = data.zc.content
          }
          if (type == 'introduction') {
            this.dataForm.introduction = data.js.content
          }
          if (type == 'reserveRemind') {
            this.dataForm.reserveRemind = data.tx.content
          }
        } else {
          this.$message.error(data.msg);
        }
      });
    },
    //自动获取周边
    jtzb() {
      var coordinates = this.dataForm.coordinates
      if (!coordinates) {
        this.$message.error("请先获取经纬度");
        return false
      }
      //已存在交通周边
      if (this.dataForm.traffic) {
        this.$confirm('您已有交通周边内容，是否覆盖?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.sellerJiaoTong(coordinates);
        })
        return false
      }
      this.sellerJiaoTong(coordinates);
    },
    //预览
    handlePictureCardPreview(file) {
      this.index = 0;
      this.showImage = file.url;
    },
    //根据地址获取经纬度
    getCoordinates() {
      this.$http({
        url: this.$http.adornUrl(`/hotel/common/getCoordinates`),
        method: 'get',
        params: this.$http.adornParams({
          address: this.dataForm.address
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          console.log(data.lng + ',' + data.lat);
          this.dataForm.coordinates = data.lng + ',' + data.lat;
          this.dataForm.city = data.city;
        } else {
          this.$message.error(data.msg);
        }
      });
    },
    //获取交通周边
    sellerJiaoTong(location) {
      this.$http({
        url: this.$http.adornUrl(`/hotel/common/sellerJiaoTong`),
        method: 'get',
        params: this.$http.adornParams({
          location: location
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          console.log(data.htmlMap);
          this.dataForm.traffic = data.htmlMap.train;
          this.dataForm.traffic += "<p><br></p>";
          this.dataForm.traffic += data.htmlMap.airport;
          this.dataForm.traffic += "<p><br></p>";
          this.dataForm.traffic += data.htmlMap.metro;
          this.dataForm.traffic += "<p><br></p>";
          this.dataForm.traffic += data.htmlMap.cart;
          this.dataForm.traffic += "<p><br></p>";
          this.dataForm.traffic += data.htmlMap.shopping;
          this.dataForm.traffic += "<p><br></p>";
          this.dataForm.traffic += data.htmlMap.scenic;
        } else {
          this.$message.error(data.msg);
        }
      });
    },
    onSearchResult(pois) {
      let latSum = 0;
      let lngSum = 0;

      pois.forEach(poi => {
        let { lng, lat } = poi;
        lngSum += lng;
        latSum += lat;
        this.markers.push([poi.lng, poi.lat]);
      });
      let center = {
        lng: lngSum / pois.length,
        lat: latSum / pois.length
      };
      this.mapCenter = [center.lng, center.lat];
    },
    getMarkerEvents() {
      return {
        click: ({ lnglat }) => {
          const host = 'https://restapi.amap.com/v3/geocode/regeo';
          axios.get(`${host}?location=${lnglat.lng},${lnglat.lat}&key=61da46f8202196bd6a794a0fd70d8a9b`).then(res => {
            if (!this.dataForm.address) {
              this.dataForm.address = res.data.regeocode.formatted_address;
            }
            if (Array.isArray(res.data.regeocode.addressComponent.city)) {
              this.dataForm.city = res.data.regeocode.addressComponent.province;
            } else this.dataForm.city = res.data.regeocode.addressComponent.city;
            this.dataForm.coordinates = lnglat.lng + ',' + lnglat.lat;
            if (!this.dataForm.traffic) {
              this.sellerJiaoTong(lnglat.lng + ',' + lnglat.lat);
            }
            console.debug(this.dataForm);
            this.showMap = false;
          });
        }
      };
    },
    getImgs(img) {
      return (img || '')
        .split(',')
        .filter(url => !!url)
        .map(url => ({
          name: url,
          url
        }));
    },
    fetchhotelBrands() {
      this.$http({
        url: this.$http.adornUrl('/hotel/seller/hotelBrands'),
        method: 'get'
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.brandOptions = [
            {
              name: '请选择',
              value: 0,
              brands: [{ name: '无', id: 0 }]
            },
            ...data.data
          ];
        }
        console.log(data);
      });
    },
    getTopics() {
      this.$http({
        url: this.$http.adornUrl(`/hotel/hoteltopic/list`),
        method: 'get',
        params: this.$http.adornParams({
          page: 0,
          limit: 999
        })
      }).then(({ data }) => {
        this.topics = data.page.list;
      });
    },

    getFacility() {
      this.$http({
        url: this.$http.adornUrl(`/hotel/hotelfacility/list`),
        method: 'get',
        params: this.$http.adornParams({
          page: 0,
          limit: 999,
          type: 1
        })
      }).then(({ data }) => {
        console.log(data.page);
        this.facility = data.page.list;
      });
    },
    init() {
      this.dataListLoading = true;
      this.getFacility();
      this.fetchhotelBrands();
      this.getTopics();
      this.$http({
        url: this.$http.adornUrl(`/hotel/hotelseller/store/0`),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({ data }) => {
        if (data && data.code === 0) {
          const hotelSeller = data.hotelSeller || {};
          this.dataForm = {
            id:hotelSeller.id,
            name:hotelSeller.name,
            star:hotelSeller.star,
            address:hotelSeller.address,
            coordinates:hotelSeller.coordinates,
            linkName:hotelSeller.linkName,
            linkTel:hotelSeller.linkTel,
            tel:hotelSeller.tel,
            openTime:hotelSeller.openTime,
            renovationTime:hotelSeller.renovationTime,
            rule:hotelSeller.rule,
            topic:hotelSeller.topic,

            introduction:hotelSeller.introduction,
            policy:hotelSeller.policy,
            reserveRemind:hotelSeller.reserveRemind,
            traffic:hotelSeller.traffic,
            trialInfoState:hotelSeller.trialInfoState,
            trialMsg:hotelSeller.trialMsg,

            facility: hotelSeller.facility ? hotelSeller.facility.split(',') : [],
            brand: hotelSeller.brand ? hotelSeller.brand : [0, 0],
            tagList: hotelSeller.tagList || [],
            metro: hotelSeller.metro === 1,
            repast: hotelSeller.repast === 1,
            wake: hotelSeller.wake === 1,
            wifi: hotelSeller.wifi === 1,
            park: hotelSeller.park === 1,
            breakfast: hotelSeller.breakfast === 1,
            unionpay: hotelSeller.unionpay === 1,
            gym: hotelSeller.gym === 1,
            boardroom: hotelSeller.boardroom === 1,
            water: hotelSeller.water === 1,
            yeOpen: hotelSeller.yeOpen === 1,
            wxOpen: hotelSeller.wxOpen === 1,
            ddOpen: hotelSeller.ddOpen === 1
          };
        }
        this.dataListLoading = false;
      });
    },
    // 表单提交
    dataFormSubmit() {
      console.log(this.dataForm.facility);
      this.$refs['dataForm'].validate(valid => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl(`/hotel/hotelseller/infoUpdate`),
            method: 'post',
            data: this.$http.adornData({
              ...this.dataForm,
              id: this.dataForm.id || undefined,
              wake: this.dataForm.wake ? '1' : '0',
              wifi: this.dataForm.wifi ? '1' : '0',
              facility: this.dataForm.facility
                .filter(f => f && f !== '')
                .reduce((p, n) => {
                  p += n + ',';
                  return p;
                }, ''),
              metro: this.dataForm.metro ? '1' : '0',
              repast: this.dataForm.repast ? '1' : '0',
              tagList: this.dataForm.tagList,
              park: this.dataForm.park ? '1' : '0',
              breakfast: this.dataForm.breakfast ? '1' : '0',
              unionpay: this.dataForm.unionpay ? '1' : '0',
              gym: this.dataForm.gym ? '1' : '0',
              boardroom: this.dataForm.boardroom ? '1' : '0',
              water: this.dataForm.water ? '1' : '0',
              yeOpen: this.dataForm.yeOpen ? '1' : '0',
              wxOpen: this.dataForm.wxOpen ? '1' : '0',
              ddOpen: this.dataForm.ddOpen ? '1' : '0',
              freezeBalance: 0
            })
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.init();
              this.$message({
                message: this.$t('Common.OperationSuccessful'),
                type: 'success',
                duration: 1500,
                onClose: () => {

                }
              });
            } else {
              this.$message.error(data.msg);
            }
          });
        }
      });
    },

    onEditorBlur() {},
    onEditorFocus() {
      //获得焦点事件
    },
    onEditorChange() {
      //内容改变事件
    },
    handleClose(tag) {
      this.dataForm.tagList.splice(this.dataForm.tagList.indexOf(tag), 1);
    },

    showInput() {
      this.inputVisible = true;
      this.$nextTick(_ => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },

    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dataForm.tagList.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = '';
    },
    handleAvatarSuccess(res, file) {
      this.dataForm.ewmLogo = res.url;
    },

    handleImageSuccess(res, file, fileList) {
      const list = fileList.map(item => {
        if (item.response) {
          return item.response.url;
        } else {
          return item.url;
        }
      });
      this.dataForm.img = list.join(',');
    },
    handleImageRemove(file, fileList) {
      this.handleImageSuccess({}, file, fileList);
    },
    beforeAvatarUpload(file) {
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 2MB!');
      }
      return isLt2M;
    }
  }
};
</script>
<style lang="scss">
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 148px;
  height: 148px;
  line-height: 148px;
  text-align: center;
}
.avatar {
  width: 148px;
  height: 148px;
  display: block;
}
.mod-demo-ueditor {
  position: relative;
  z-index: 510;
  > .el-alert {
    margin-bottom: 10px;
  }
}
.el-tag + .el-tag {
  margin-left: 10px;
}
.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}
.input-new-tag {
  width: 190px;
  margin-left: 10px;
  vertical-align: bottom;
}
.mod-demo-ueditor {
  position: relative;
  z-index: 510;
  > .el-alert {
    margin-bottom: 10px;
  }
}
.map-wrap {
  position: relative;

  .map {
    height: 400px;
  }

  .map-search {
    position: absolute;
    left: 20px;
    top: 20px;
  }
}
.hotelseller-addorupdate-jdss .el-form-item__content {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  .el-checkbox+.el-checkbox {
    margin-left: 0;
  }
  .el-checkbox {
    width: 100px;
  }
}
// 富文本框 样式 适配
@media (max-width: 1400px) {
  .mengdianxingxi /deep/ {
    .el-form-item__content {
      .el-button.el-button--primary {
        margin-top: 33px;
      }
    }
  }
}
</style>
